import './index.scss';
import tpl from './index.tpl';
//数据模型
import {
  CartModel
} from '../../../models/cart';
import CheckBox from '../check_box/index';
import NumSelector from '../num_selector/index';
import Toast from '../../toast/index';

//实例化
const cartModel = new CartModel(),
  checkBox = new CheckBox(),
  numSelector = new NumSelector(),
  toast = new Toast();

export default () => {
  return {
    name: 'listItem',
    //购物车商品列表
    makeList(data) {
      let list = '';

      data.forEach((elem, idx) => {
        elem.checked = true;
        list += tpl().replace(/{{(.*?)}}/g, (node, key) => {
          return {
            img_url: elem.img_url,
            goods_name: elem.goods_name,
            price: elem.price,
            check_box: checkBox.tpl(elem.id, 'subCheck', idx),
            num_selector: numSelector.tpl(elem.num, elem.id, elem.limitation, idx),
            id: elem.id,
            index: idx
          } [key];
        });
      });

      return list;
    },
    //商品列表事件委托
    listEvent(e) {
      const tar = e.target,
        className = tar.className;

      //子组件利用promise抛出数据给父组件
      return new Promise((resolve, reject) => {
        //排除其他被点击的标签元素，防止误点
        if (className === 'item btn') {
          const field = tar.dataset.field,
            oParent = tar.parentNode,
            id = oParent.dataset.id,
            idx = oParent.dataset.index,
            litmitation = tar.dataset.limitation,
            oInput = document.getElementById('J_numInput_' + id);

          switch (field) {
            case 'add':
              //整形字符串
              if (parseInt(oInput.value) < litmitation) {
                oInput.value = parseInt(oInput.value) + 1;

                cartModel.updateCartNum(id, oInput.value);
                resolve({
                  field: 'numSelector',
                  num: oInput.value,
                  idx: idx
                });

                // this.updateCartNum(id, oInput.value, resolve);
              } else {
                resolve(-1);
              }
              break;
            case 'minus':
              if (parseInt(oInput.value) > 1) {
                oInput.value = parseInt(oInput.value) - 1;

                cartModel.updateCartNum(id, oInput.value);
                resolve({
                  field: 'numSelector',
                  num: oInput.value,
                  idx: idx
                });

                // this.updateCartNum(id, oInput.value, resolve);
              } else {
                resolve(-1);
              }
              break;
            default:
              break;
          }
        } else if (className === 'check-input J_subCheck' || className === 'fa fa-check') {
          //确保所有的商品勾选了才能激活全选的类名样式
          const oSubChecks = Array.from(document.getElementsByClassName('J_subCheck')),
            oMainCheck = document.getElementsByClassName('J_mainCheck'),
            oParent = tar.parentNode,
            idx = oParent.dataset.index,
            checked = oSubChecks[idx].checked;

          //如果都全选返回true，否则为false
          oMainCheck.checked = oSubChecks.every((elem) => {
            return elem.checked === true;
          });

          //抛出数据
          resolve({
            field: 'checkBox',
            idx,
            checked
          });
        } else if (className === 'fa fa-trash') {
          //是否点击到商品编辑里每条商品右边的删除按钮
          const id = tar.dataset.id,
            idx = tar.dataset.index,
            oItem = tar.parentNode.parentNode;

          //提交删除某一项
          cartModel.removeCartItem(id)
            .then((res) => {
              const code = res.ms_code;
              if (code === '200') {
                //提升：删除成功
                toast.showToast({
                  icon: 'success',
                  title: '删除成功',
                  duration: 1500
                })
                oItem.remove();
                //抛出数据
                resolve({
                  field: 'remove',
                  idx,
                  id: id
                })
              } else {
                //提升：删除失败
                toast.showToast({
                  icon: 'warning',
                  title: '删除失败',
                  duration: 1500
                })
              }
            })
        }
      })
    },


    // listEvent(e) {
    //   const tar = e.target,
    //     className = tar.className;

    //   return new Promise((resolve, reject) => {
    //     if (className === 'item btn') {
    //       const field = tar.dataset.field,
    //         oParent = tar.parentNode,
    //         id = oParent.dataset.id,
    //         idx = oParent.dataset.index,
    //         limitation = tar.dataset.limitation,
    //         oInput = document.getElementById('J_numInput_' + id);

    //       switch (field) {
    //         case 'add':

    //           if (parseInt(oInput.value) < limitation) {
    //             oInput.value = parseInt(oInput.value) + 1;
    //             cartModel.updateCartNum(id, oInput.value);
    //             resolve({
    //               field: 'numSelector',
    //               num: oInput.value,
    //               idx
    //             });
    //           } else {
    //             resolve(-1);
    //           }

    //           break;
    //         case 'minus':
    //           if (parseInt(oInput.value) > 1) {
    //             oInput.value = parseInt(oInput.value) - 1;
    //             cartModel.updateCartNum(id, oInput.value);
    //             resolve({
    //               field: 'numSelector',
    //               num: oInput.value,
    //               idx
    //             });
    //           } else {
    //             resolve(-1);
    //           }

    //           break;
    //         default:
    //           break;
    //       }

    //     } else if (className === 'check-input J_subCheck' || className === 'fa fa-check') {
    //       const oSubChecks = Array.from(document.getElementsByClassName('J_subCheck')),
    //         oMainCheck = document.getElementsByClassName('J_mainCheck')[0],
    //         oParent = tar.parentNode,
    //         idx = oParent.dataset.index,
    //         checked = oSubChecks[idx].checked;

    //       oMainCheck.checked = oSubChecks.every((elem) => {
    //         return elem.checked === true;
    //       });

    //       resolve({
    //         field: 'checkBox',
    //         idx,
    //         checked
    //       });
    //     } else if (className === 'fa fa-trash') {
    //       const id = tar.dataset.id,
    //         idx = tar.dataset.index,
    //         oItem = tar.parentNode.parentNode;

    //       cartModel.removeCartItem(id).then((res) => {
    //         const code = res.msg_code;

    //         if (code === '200') {
    //           toast.showToast({
    //             icon: 'success',
    //             title: '删除成功',
    //             duration: 1500
    //           });
    //           oItem.remove();
    //           resolve({
    //             field: 'remove',
    //             idx
    //           });
    //         } else {
    //           toast.showToast({
    //             icon: 'warning',
    //             title: '删除失败',
    //             duration: 1500
    //           });
    //         }
    //       });
    //     }
    //   });
    // }
  }
}